<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<%@ taglib prefix="s" uri="/struts-tags"%>

<!doctype  html>
<head>
<!-- 	<link href='img/logo/ensabap_ico.png' rel='shortcut icon' type='image/png'> -->
	<title>Elija su ROL</title>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<meta http-equiv="Content-Style-Type" content="text/css" />
	<sj:head jqueryui="true" jquerytheme="rescsa" customBasepath="themes"/>
	<!--[if IE]>
  		<link rel="stylesheet" type="text/css" href="css/iehacks.css" />
	<![endif]-->
    


    <link href="css/reset.css" rel="stylesheet" type="text/css" media="screen">	
	<link href="css/grid.css" rel="stylesheet" type="text/css" media="screen">
	<link href="css/estilos.css" rel="stylesheet" type="text/css" media="screen">
	<link href="css/utiles.css" rel="stylesheet" type="text/css" media="screen">
	<link href="css/forms.css" rel="stylesheet" type="text/css" media="screen">

<%--     <script type="text/javascript" src="js/jquery-1.7.1.min.js" ></script> --%>
   
<style>
	body{
		font-family:Helvetica,Arial;
		font-size:16px;
		background-color: #444;
		background-image:url(img/bg/fondo/bg_diagonal2.png); 
	    background-repeat: repeat !important; 
	}
	.opcionRol{
		font-size:0.7em;
		text-shadow:0px 1px 1px rgba(250,250,250,0.9),0px -1px 1px rgba(0,0,0,0.2);
		margin-bottom:-7px;
		background-color: rgba(255,255,255,0.6);
		margin-bottom:10px;
		height:150px;
		text-align:center;
		line-height:150px;

	}
	.opcionRol:hover{
		background-color: rgba(255,255,255,1);
		color:rgba(50,180,15,0.7);
	}
	.ultimo{
		margin-bottom:0px;
	}
	#contenedor{
	padding-bottom: 10px;
	padding-right: 10px;
	width: 320px;
	}
</style>

</head>
<body class="trns50">
	<div class="container">
	<div class="prepend-8">
		<div id="contenedor"   class="span-8 clearfix rdnd5 smbrD">
			<s:iterator value="#session.ROLES" >
				<a class="span-4 opcionRol rdnd5" id='<s:property value="c_rol"/>' href="#"><s:property value="n_nombre"/> </a>
			</s:iterator>
			</div>
	</div>
	</div>

<form id="frmOculRol" action="Intranet.html" method="post">
	<s:hidden name="ayr" value="yia"></s:hidden>
	<input type="hidden" id="idRolSeleccionado" name="idRolActual">
<!-- 	<input type="hidden" id="descRolSeleccionado" name="descRolActual"> -->
</form>

<script>

$(document).ready(function(){
	
	$(".opcionRol").live("click",function(){
		$("#idRolSeleccionado").val($(this).attr("id"));
		$("#frmOculRol").submit();
	});
	
	
});
</script>
	
</body>